<div class="d-flex justify-content-between">
  <h3 class="primary-text m-0">{{ 'menu.restart.title' | translate }}</h3>
</div>
<div class="my-4 align-items-center" style="max-width: 1000px; margin: auto">
  <div class="w-100 text-center primary-text mb-5">
    <i class="fas fa-power-off" style="font-size: 75px"></i>
  </div>
  <p class="w-100 text-center my-5">
    <button type="button" class="btn btn-primary p-3 my-0" style="width: 85%" (click)="restartHomebridge()">
      {{ 'menu.hbrestart.confirm_hb' | translate }}
    </button>
  </p>
  <p class="w-100 text-center my-5">
    <button
      type="button"
      class="btn btn-primary p-3 my-0"
      style="width: 85%"
      (click)="restartHomebridgeService()"
      container="body"
      [openDelay]="150"
      triggers="hover"
      [ngbTooltip]="'reset.force_restart_hb_help_text' | translate"
    >
      {{ 'menu.hbrestart.confirm_ui' | translate }}
    </button>
  </p>
  @if (canShutdownRestartHost) {
  <p class="w-100 text-center my-5">
    <button type="button" class="btn btn-primary p-3 my-0" style="width: 85%" (click)="restartServer()">
      {{ 'menu.linux.label_restart_server' | translate }}
    </button>
  </p>
  } @if (canShutdownRestartHost) {
  <p class="w-100 text-center my-5">
    <button type="button" class="btn btn-primary p-3 my-0" style="width: 85%" (click)="shutdownServer()">
      {{ 'menu.linux.label_shutdown_server' | translate }}
    </button>
  </p>
  } @if (runningInDocker) {
  <p class="w-100 text-center my-5">
    <button type="button" class="btn btn-primary p-3 my-0" style="width: 85%" (click)="dockerRestartContainer()">
      {{ 'menu.docker.restart_container' | translate }}
    </button>
  </p>
  }
</div>
